<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
      <script th:src="@{/webjars/jquery/3.5.1/jquery.js}">

      </script>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Jekyll v4.0.1">
    <title>Dashboard</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/4.5/examples/dashboard/">

    <!-- Bootstrap core CSS -->
<link th:href="@{/webjars/bootstrap/4.5.0/css/bootstrap.css}" rel="stylesheet">

    <style>
      .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }
    </style>
      <script th:src="@{/webjars/jquery/3.5.1/jquery.js}"></script>
    <!-- Custom styles for this template -->
    <link href="/stud/dashboard.css" rel="stylesheet">

  </head>
  <body>
  <div th:replace="common/bar::topbar"></div>
<script th:inline="javascript" type="text/javascript">

    function getStu(obj) {
        var url1 = $(obj).attr("Myid")
        jQuery.ajax({
            type: "get",
            url: url1,
            success: function (data) {

                $("#myTbody").append('<tr> '+
                    '                    <td>\n' +
                                            data.student.id +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.name +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.sex +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                            data.student.phone +
                    '                    </td>\n' +
                    '                    <td>\n' +
                                           data.student.enterDate +
                    '                    </td>\n' +
                    '                    <td>\n' +
                    '                        <a class="btn btn-sm btn-primary" href="/tcr/student/'+data.student.id+'">编辑</a>\n' +
                    '                    </td>\n' +
                    '                </tr>');
                $("#showMsg").text(data.msg)
            },
            error: function () {
                alert("请重试")
            }
        })
        return false;
    }



</script>
<div class="container-fluid">
  <div class="row">
   <div th:replace="common/bar::sidebar(activeUri='rexam')"></div>

    <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
      <div class="table-responsive">
            <br>
          <div>
          </div>
          <form id="findExamForm"  method="get" th:action="@{/stud/exams}">
          <input type="date" name="date" id="findExamDate">
            <button class="btn btn-sm btn-info" type="submit" id = "findExamBtn">查看考试预约</button>
          </form>
      </div>
        <script>

        </script>
        <div class="table-responsive">
            <p id="showMsg"></p>
        </div>
<p class="text-success" th:text="${msg}"></p>
        <div class="table-responsive">
            <table class="table table-striped table-sm">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>Teacher</th>
                    <th>Student</th>
                    <th>ExamDate</th>
                    <th>Course</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="exeItem,st:${exams}" th:if="${exams!=null}">
                    <td th:text="${st.count}"></td>
                    <td th:text="${exeItem.teacher!=null}?${exeItem.getTeacher().getName()}"></td>
                    <td th:text="${exeItem.student!=null}?${exeItem.getStudent().getName()}"></td>
                    <td th:text="${exeItem.getExaminationDate()}"></td>
                    <td th:text="${exeItem.getCourse()}"></td>
                    <td>
                        <div class="btn-group">
                            <button type="button"
                                    th:attr="reserve_uri=@{/stud/exam/reserve/}+${exeItem.getId()}"
                                    th:class="${exeItem.getSid()==null}?'btn btn-sm btn-success reserveBtn':'btn btn-sm btn-success reserveBtn disabled'" >预约</button>
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
      <form id="delForm" method="post" action="#">
        <input type="hidden" name="_method" value="delete"/>
      </form>
        <form id="reserveForm" method="post">
            <input type="hidden" name="_method" th:value="put">
        </form>
    </main>
  </div>
</div>

    <script th:inline="javascript" th:type="javascript">

    </script>
    <script>
      $(".reserveBtn").click(function(){
          var btn = $(this);
          if(!btn.hasClass("disabled")){
              $("#reserveForm").attr("action",btn.attr("reserve_uri")).submit();
          }else {
              alert("已经被预约！换一个试试!");
          }
          return false;
      })
      // $("#findExamBtn").click(function () {
          // var action = "/stud/exam/";
          // var x = document.getElementById("findExamDate").value
          // action += x;
          // // $("#findExamForm").attr("action",action).submit();
          // return false;
      // })
      var time = new Date()
      var day = ('0' + time.getDate()).slice(-2)
      var month = ('0' + (time.getMonth() + 1)).slice(-2)
      var today = time.getFullYear() + '-' + month + '-' + day
      $("input[type=date]").val(today)
    </script>
<!--<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>-->
      <!--<script>window.jQuery || document.write('<script src="../assets/js/vendor/jquery.slim.min.js"><\/script>')</script><script src="../assets/dist/js/bootstrap.bundle.js"></script>-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.9.0/feather.min.js"></script>
        <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>-->
        <script th:src="@{/stud/dashboard.js}"></script></body>
</html>
